<template>
    <basic-container>
        <avue-crud :option="option" :data="data" ref="crud" v-model="form" :table-loading="loading"
                   :permission="permissionList"
                   :page="page" @refresh-change="refreshChange" @search-change="searchChange"
                   @search-reset="searchReset" @current-change="currentChange"
                   @size-change="sizeChange" @on-load="onLoad">
            <!-- 自定义添加搜索条件  按日期搜索  -->
            <template slot="search">
                <el-col :md="16" :xs="24">
                    <el-form-item label="有效期">
                        <el-date-picker text="有效期" v-model="acTime" type="daterange" range-separator="至" size="mini"
                                        start-placeholder="开始日期" end-placeholder="结束日期" align="right"
                                        format="yyyy-MM-dd" value-format="yyyy-MM-dd">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
            </template>
            <template slot-scope="{ row }" slot="menu">
                <el-button v-if="row.adCheckStatus==0 &&userOrganizationId!=row.organizationId || row.adCheckStatus==0&&isAdmin" type="primary" size="small" @click.stop="handleEdit(row)">
                    审核上架
                </el-button>
                <span v-if="row.adCheckStatus==0 && userOrganizationId==row.organizationId && !isAdmin" type="primary" size="small">
                    无审核权限
                </span>
                <span v-if="row.adCheckStatus!=0">已审核</span>
            </template>
        </avue-crud>
<!--        <el-col class="btnRow" :span="8">-->
<!--            <el-button @click="allPass" type="primary" size="small">审核通过</el-button>-->
<!--            <el-button @click="allRefund" size="small">审核拒绝</el-button>-->
<!--        </el-col>-->

        <!--审核上架-->
        <el-drawer title="" :visible.sync="dialogTableVisible" :with-header="false" size="50%" :before-close="beforeClose">
            <div style="padding: 30px">
                <avue-form ref="obj" v-model="obj" :option="optionView" @submit="checkSubmit">
                    <template slot="adAccUrl">
                            <el-row style="display: flex;">
                                <el-input disabled :value="obj.adAccUrl"></el-input>
                                <el-image :src="obj.adAccUrl" style="width: 50px;height: 50px;margin-left: 10px;" :preview-src-list="srcList"></el-image>
                            </el-row>
                    </template>
                    <template slot="adValue">
                        <el-row style="display: flex;">
                            <el-input disabled :value="restoreTable"></el-input>
                        </el-row>
                    </template>
                </avue-form>
            </div>
        </el-drawer>
        <!--批量审核-->
<!--        <el-dialog title="拒绝审核原因" :visible.sync="dialogVisibleSell" width="40%">-->
<!--            <el-form ref="form" :model="formCheck" label-width="120px" :rules="rules">-->
<!--                <el-form-item label="拒绝原因" prop="auditDesc">-->
<!--                    <el-input type="textarea" v-model="formCheck.auditDesc" @input="change($event)"></el-input>-->
<!--                </el-form-item>-->
<!--            </el-form>-->
<!--            <span slot="footer" class="dialog-footer">-->
<!--				<el-button @click="editCancel">取 消</el-button>-->
<!--				<el-button type="primary" @click="editSellSubmit">确 定</el-button>-->
<!--			</span>-->
<!--        </el-dialog>-->
    </basic-container>
</template>
<script>
    import selFile from "@/components/file/selFile";
    import uploadPic from "@/components/file/uploadPic";
    import {
        getListAd,
        auditPoster
    } from "@/api/base/operations/advertManage/checkAd";
    import {
        mapGetters
    } from "vuex";
    import {
        getGoodsList,
        getStoreList,
        getActList,
    } from "@/api/base/operations/advertManage/advert";
    var Dict = JSON.parse(localStorage.getItem("mall-dictionary")).content;
    var adPutStatusDict = [{
        label: "审核通过",
        value: 1
    }, {
        label: "未审核",
        value: 0
    }, {
        label: "审核拒绝",
        value: -1
    }];
    export default {
        data() {
            return {
                restoreTable:'',
                userOrganizationId:'',
                srcList:[], // 图片预览列表
                dialogTableVisible: false,
                dialogVisibleSell: false,
                obj: {},
                formCheck: {
                    auditDesc: ''
                },
                rules: {
                    auditDesc: [
                        {required: true, message: '请输入拒绝原因', trigger: 'blur'},
                    ],
                },
                acTime: '',
                placeholder: '请选择广告图片',
                value: '',
                total: null, // 获取总数据量
                apPrice: "",
                titleBan: '新增广告',
                isView: false,
                isApView: false,
                innerVisible: false,
                tableData: [],
                posData: [],
                form: {},
                query: {},
                loading: true,
                page: {
                    pageSize: 10,
                    currentPage: 1,
                    total: 0
                },
                option: {
                    size: "mini",
                    excelBtn: false,
                    addBtn: false,
                    tip: false,
                    editBtn: false,
                    delBtn: false,
                    border: true,
                    index: false,
                    selection: false,
                    viewBtn: false,
                    rowKey: "id",
                    height: "auto",
                    // calcHeight: 380,
                    dialogType: "dialog",
                    align: 'center',
                    menuWidth: 150,
                    searchMenuSpan: 6,
                    column: [{
                        label: "广告名称",
                        prop: "adTitle",
                        search: true,
                        fixed: true,
                    },
                        {
                            label: "广告位名",
                            prop: "apTitle",
                            search: true,
                            addDisplay: false,
                            editDisplay: false,
                            rules: [{
                                required: true,
                                message: "请输入广告位",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: "广告位名",
                            prop: "adApId",
                            hide: true,
                            addDisplay: false,
                            editDisplay: false,
                            rules: [{
                                required: true,
                                message: "请输入广告位",
                                trigger: "blur"
                            }]
                        },
                        {
                            type: "select",
                            label: "广告类型",
                            prop: "adType",
                            dicData: Dict.ADVERT_TYPE,
                            rules: [{
                                required: true,
                                message: "请输入广告类型 1商品详情  2店铺  4促销活动 6秒杀活动 8拼团 7聚合页",
                                trigger: "blur"
                            }]
                        },
                        {
                            type: "select",
                            label: "审核状态",
                            prop: "adCheckStatus",
                            search: true,
                            dicData: adPutStatusDict,
                            rules: [{
                                required: true,
                                message: "请选择是否投放",
                                trigger: "blur"
                            }]
                        },
                        {
                            type: "datetime",
                            label: "开始时间",
                            prop: "adBeginTime",
                            width:140,
                            format: "yyyy-MM-dd HH:mm:ss",
                            valueFormat: "yyyy-MM-dd HH:mm:ss",
                            rules: [{
                                required: true,
                                message: "请输入广告开始时间--不可售卖可用",
                                trigger: "blur"
                            }]
                        },
                        {
                            type: "datetime",
                            label: "结束时间",
                            width:140,
                            prop: "adEndTime",
                            format: "yyyy-MM-dd HH:mm:ss",
                            valueFormat: "yyyy-MM-dd HH:mm:ss",
                            rules: [{
                                required: true,
                                message: "请输入广告结束时间--非售卖广告可用",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: "区域",
                            type: "tree",
                            prop: "organizationId",
                            search: true,
                            defaultExpandAll: false,
                            disabled: false,
                            dicUrl: '/base/organization/listTreeBylevelM?levelM=3',
                            props: {
                                label: 'name',
                                value: 'id',
                                children: 'childrenNodes'
                            },
                            rules: [{
                                required: true,
                                message: "请选择区域",
                                trigger: "blur"
                            }]
                        },
                    ]
                },
                optionView: {
                    size: "mini",
                    excelBtn: false,
                    emptyBtn: false,
                    tip: false,
                    editBtn: false,
                    delBtn: false,
                    border: true,
                    index: false,
                    selection: false,
                    viewBtn: false,
                    rowKey: "id",
                    height: "auto",
                    // calcHeight: 380,
                    dialogType: "dialog",
                    align: 'center',
                    menuWidth: 300,
					labelWidth:130,
                    column: [{
                        label: "广告名称",
                        prop: "adTitle",
                        row: true,
						span:20,
                        disabled:true,
                    },
                        {
                            label: "广告位",
                            prop: "apTitle",
                            row: true,
							span:20,
                            disabled:true,
                        },
                        {
                            type: "select",
                            label: "广告类型",
                            prop: "adType",
                            dicData: Dict.ADVERT_TYPE,
                            row: true,
							span:20,
                            disabled:true,
                        },
                        {
                            label:'广告类型值选择',
                            prop: "adValue",
                            formslot: true,
                            disabled:true,
                            row:true,
							span:20,
                        },
                        {
                            type: "datetime",
                            label: "开始时间",
                            prop: "adBeginTime",
                            format: "yyyy-MM-dd HH:mm:ss",
                            valueFormat: "yyyy-MM-dd HH:mm:ss",
                            row: true,
							span:20,
                            disabled:true,
                        },
                        {
                            type: "datetime",
                            label: "结束时间",
                            prop: "adEndTime",
                            format: "yyyy-MM-dd HH:mm:ss",
                            valueFormat: "yyyy-MM-dd HH:mm:ss",
                            row: true,
							span:20,
                            disabled:true,
                        }, {
                            label: "广告图片",
                            prop: "adAccUrl",
                            row: true,
							span:20,
                            disabled:true,
                            formslot:true,
                        }, {
                            label: "是否审核",
                            prop: "isCheck",
                            type: "radio",
                            valueDefault:'1',
                            dicData: [{
                                label: "通过",
                                value: '1'
                            }, {
                                label: "拒绝",
                                value: '-1'
                            }],
                            rules:[{
                               required:true,message:'请选择审核结果',trigger:'blur'
                            }],
                            row: true,
							span:20,
                            // change:({value})=>{
                            //     if(value) {
                            //         if(value==1) {
                            //             this.optionView.column[7].display=false
                            //         }else {
                            //             this.optionView.column[7].display=true
                            //         }
                            //     }
                            // }
                        },
                        // {
                        //     label: '审核拒绝原因',
                        //     prop: 'auditDesc',
                        //     display: true,
                        //     rules: [
                        //         {
                        //             required: true,
                        //             message: '请输入审核拒绝原因',
                        //             trigger: 'blur'
                        //         }
                        //     ]
                        // }
                    ]
                },
                data: [],
                dicData: [],
                isAdmin:false,
            };
        },
        created() {
            var arr = this.userInfo.roleIds
            this.isAdmin = arr.includes(1) || arr.includes(8)
            this.userOrganizationId = this.userInfo.organizationId // 获取用户的区域Id
            this.dicData = JSON.parse(localStorage.getItem("mall-dictionary")).content;
        },
        watch:{
            // 'obj':(val)=>{
            //     if(val) {
            //         console.log('val',val)
            //         if(val.adTypeValue=='') {
            //             this.optionView.column[2].display = false
            //             this.optionView.column[3].display = false
            //         }else {
            //             this.optionView.column[2].display = true
            //             this.optionView.column[3].display = true
            //         }
            //     }
            // }
        },
        components: {
            selFile,
            uploadPic
        },
        computed: {
            ...mapGetters(["permission", 'userInfo', 'dictionariy']),
            permissionList() {
                return {};
            },
        },
        methods: {
            beforeClose(done) {
                this.dialogTableVisible=false
                this.$refs.obj.resetForm();
                this.$refs.obj.clearValidate();
                this.obj={}
                this.value=''
                if(done) {
                    done()
                }
            },
            searchReset() {
                this.query = {};
                this.acTime = []
                this.onLoad(this.page);
            },
            handleEdit(row) {
                let type = row.adType
                let value = row.adTypeValue
                if(!row.adTypeValue) {
                    this.valueFlag = "";
                    this.selectQuery = "";
                    this.obj = row
                    this.srcList = [row.adAccUrl]
                    this.dialogTableVisible = true
                    return;
                }
                //查询参数
                let param = {};
                //1商品详情  2店铺  4促销活动 6秒杀活动 8拼团
                if (type == 1) {
                    param = {id:value};
                    getGoodsList('','',param).then(res => {
                        this.restoreTable = res.data.data[0].goodsName;
                        this.value = '商品名称'
                    });
                } else if (type == 2) {
                    param = {
                        id:value
                    };
                    getStoreList('','',param).then(res => {
                        this.restoreTable = res.data.data[0].storeName;
                        this.value = '店铺名称'
                    });
                } else if (type == 4 || type == 6 || type == 8) {
                    param = {id:value};
                    getActList('','',param).then(res => {
                        this.restoreTable = res.data.data[0].acTitle;
                        this.value = '活动名称'
                    });
                } else if (type == 9) {
                    this.restoreTable = row.adTypeValue;
                }
                this.obj = row
                this.srcList = [row.adAccUrl]
                this.dialogTableVisible = true
            },
            searchChange(params, done) {
                this.page.currentPage = 1
                params.adBeginTime = this.acTime[0] || ''
                params.adEndTime = this.acTime[1] || ''
                console.log(params)
                this.query = params;
                console.log(this.query)
                this.onLoad(this.page, params, done);
            },
            currentChange(currentPage) {
                this.page.currentPage = currentPage;
            },
            sizeChange(pageSize) {
                this.page.pageSize = pageSize;
            },
            refreshChange() {
                this.onLoad(this.page);
            },
            onLoad(page, params = {}, done) {
                this.$store.dispatch("GetADVERTNUM");
                this.loading = true;
                getListAd(
                    page.currentPage,
                    page.pageSize,
                    Object.assign(params, this.query)
                ).then(res => {
                    if (done) {
                        done();
                    }
                    this.loading = false;
                    this.page.total = res.data.count;
                    // 最后一页数据全部删除时自动获取上一页数据
                    if(res.data.data.length<1 && this.page.currentPage>1) {
                        this.page.currentPage -=1
                        this.onLoad(this.page)
                        return
                    }
                    this.data = res.data.data;
                });
            },
            // 批量删除
            allPass() {
                if (this.delIds.length > 0) {
                    this.$confirm('确认全部通过审核嘛?', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.allSubmit(0);
                    });
                } else {
                    this.$message({
                        message: '至少选择一个商品',
                        type: 'warning'
                    });
                }
            },
            // 批量审核通过
            allRefund() {
                if (this.delIds.length > 0) {
                    this.dialogVisibleSell = true;
                } else {
                    this.$message({
                        message: '至少选择一个商品',
                        type: 'warning'
                    });
                }
            },
            // 批量审核取消
            editCancel() {
                this.formCheck.auditDesc = ''
                this.dialogVisibleSell = false;
            },
            // 单个审核通过
            checkSubmit(params,done) {
                // if (!this.formCheck.auditDesc) {
                //     this.$message({
                //         message: '审核拒绝时必须填写拒绝原因！',
                //         type: 'error'
                //     });
                //     return;
                // } else {
                //     var regCn = /^[\u4e00-\u9fa5a-zA-Z0-9?!.,？！，。]+$/;
                //     if (!regCn.test(this.formCheck.auditDesc)) {
                //         this.$message({
                //             type: 'error',
                //             message: '审核原因不能包含特殊字符'
                //         });
                //         this.loadBtn = false;
                //         return false;
                //     }
                // }
                let obj={
                    adCheckStatus:this.obj.isCheck,
                    id:this.obj.id
                }
                console.log('obj',obj)
                auditPoster(obj).then(res=>{
                    if(res.data.code==200) {
                        if(this.obj.isCheck==1) {
                            this.$message({
                                type: 'success',
                                message: '审核成功,请至广告管理页面查看!'
                            });
                        }else {
                            this.$message({
                                type: 'success',
                                message: '审核拒绝!'
                            });
                        }

                    }else{
                        this.$message({
                            type: 'error',
                            message: res.data.message
                        });
                    }
                    done()
                    this.dialogTableVisible=false
                    this.onLoad(this.page)
                })
                this.allSubmit(3);
            },
        }
    };
</script>

<style>
    .el-table__row .cell > span > span {
        height: 24px;
        display: block;
        overflow: hidden;
        display: -webkit-box;
        text-overflow: ellipsis;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

    .btnRow {
        position: relative;
        bottom: 51px;
        left: 10px;
    }
</style>
